<template>
  <view class="content">
    <view v-for="student in allStudent" :key="student.studentAccount">
      <view class="student-item">
        <view class="student-item-name">
          <view>学号: {{ student.studentAccount }}</view>
          <view>姓名: {{ student.studentName }}</view>
        </view>
        <view
          class="student-item-state"
          @click="handleStudent(student.studentAccount)"
        >
          <u-icon name="arrow-right-double"></u-icon>
        </view>
      </view>
    </view>

    <u-modal
      :show="show"
      @confirm="confirm"
      @cancel="cancel"
      showCancelButton
      title="添加"
      content="是否添加该学生"
    ></u-modal>
  </view>
</template>

<script>
import api from '@/api/teach/api.js'
export default {
  data() {
    return {
      show: false,
      allStudent: [],
      courseId: '',
      studentId: '',
      courseCode: '',
    }
  },
  methods: {
    handleStudent(studentAccount) {
      this.studentId = studentAccount
      this.show = !this.show
    },
    confirm() {
      this.show = !this.show
      let parme = {}
      parme.courseCode = this.courseCode
      parme.studentId = this.studentId
      this.$http
        .getMethod(api.addCourseStudent, parme)
        .then((res) => {
          if (res.code != 200) {
            uni.showToast({
              title: res.message,
              icon: 'none',
            })
          } else {
            uni.showToast({
              title: res.message,
              icon: 'none',
            })
            console.log('跳转')
            uni.navigateTo({
              url: '/pages/teacher/detailed/detailed?id=' + this.courseId,
            })
          }
        })
        .catch((error) => {
          console.log(error)
        })
    },
    cancel() {
      this.show = !this.show
    },
  },
  onLoad(option) {
    this.courseId = option.id
    this.courseCode = option.courseCode
    let parme = {}
    parme.type = 2
    this.$http
      .getMethod(api.findAccount, parme)
      .then((res) => {
        if (res.code != 200) {
          uni.showToast({
            title: res.message,
            icon: 'none',
          })
        } else {
          uni.showToast({
            title: res.message,
            icon: 'none',
          })
          console.log(res.data)
          this.allStudent = res.data
        }
      })
      .catch((error) => {
        console.log(error)
      })
  },
}
</script>

<style scoped lang="less">
.content {
  padding: 20rpx;
}
.w70 {
  width: 70%;
}
.u-form-item {
  border-bottom: 1upx solid #000;
}
.loginBtn {
  width: 100%;
  height: 80upx;
  background: #77b307;
  border-radius: 50upx;
  margin-top: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.loginBtn .btnValue {
  color: white;
}

.student-item {
  display: flex;
  padding: 25upx;
  border: 1upx solid rgba(217, 217, 217, 1);
  border-radius: 20upx;
  margin-bottom: 20upx;
  margin-top: 20upx;
  .student-item-name {
    flex: 1;
  }
  .student-item-state {
    width: 20%;
    padding: 25upx;
    border-left: 1upx solid rgba(217, 217, 217, 1);
    text-align: center;
    line-height: 60upx;
  }
}
</style>
